<template>
    <h2 class="mb-2">物易近</h2>
    <el-menu
      active-text-color="#ffd04b"
      background-color="rgb(11,2,71)"
      class="el-menu-vertical-demo"
      default-active="2"
      text-color="#fff"
      @open="handleOpen"
      @close="handleClose"
    >
      <el-sub-menu index="1">
        <template #title>
          <span>首页</span>
        </template>
          <el-menu-item index="1-2" @click="goto('worker')">跑腿员管理</el-menu-item>
          <el-menu-item index="1-3" @click="goto('user')">用户管理</el-menu-item>
          <el-menu-item index="1-4" @click="goto('order')">订单管理</el-menu-item>
          <el-menu-item index="1-5" @click="goto('ad')">广告管理</el-menu-item>
          <el-menu-item index="1-6" @click="goto('message')">留言管理</el-menu-item>

          <el-sub-menu index="2">
            <template #title>
              <span>提现记录管理</span>
            </template>
              <el-menu-item index="2-1" @click="goto('cashout')">未提现</el-menu-item>
              <el-menu-item index="2-2" @click="goto('cashoutok')">已提现</el-menu-item>

          </el-sub-menu>
      </el-sub-menu>
    </el-menu>
</template>

<script setup>
   import router from "../router"
import {
  Document,
  Menu as IconMenu,
  Location,
  Setting,
} from '@element-plus/icons-vue'
const handleOpen = (key, keyPath) => {
  console.log(key, keyPath)
}
const handleClose = (key, keyPath) => {
  console.log(key, keyPath)
}

const goto=(name)=>{
    router.push({name:name});
}
</script>

<style lang="scss" scoped>
h2{
    text-align: center;
}
.el-menu-vertical-demo{
  margin-top: 20px;
}
</style>